<template>
	<div class="h-[67px] px-5 flex items-center border-y-[1px] border-border-1">
		<base-icon class="text-[30px]" :name="nameIcon"></base-icon>
		<div class="ml-[9px] text-t-1">
			{{ name }}
		</div>
	</div>
</template>

<script lang="ts" setup>
import { computed } from 'vue'
import { WalletDepositKeys, WalletDepositType } from '@/enums'
import { BaseIcon } from '@/components/base'

const props = defineProps({
	icon: {
		type: String,
		default: ''
	},
	name: {
		type: String,
		default: ''
	}
})

const nameIcon = computed(() => {
	return WalletDepositType[props.icon?.toLowerCase() as WalletDepositKeys].icon
})
</script>
<style lang="scss" scoped></style>
